<link rel="Stylesheet" type="text/css" href="../javascript/slide_gallery/css/smoothDivScroll.css" />
<style type="text/css">
    #makeMeScrollable
    {
	width:100%;
	height: 230px;
	position: relative;
    }
    #makeMeScrollable div.scrollableArea img
    {
	position: relative;
	float: left;
	margin: 0;
	padding: 0;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-o-user-select: none;
	user-select: none;
    }
</style>
<?

function V_Slider_1($arrayData) { ?>
    <div id="makeMeScrollable">
	<?
	if (!empty($arrayData)) {
	    foreach ($arrayData as $value) {
		?>
	        <img height='230px' src="<?= DIR_IMG_SLIDE_GALLERY_HOME . $value['url_pic'] ?>" alt="Demo image"/>
		<?
	    }
	}
	?>
    </div>  
<? }
?>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" type="text/javascript"></script>
<script src="../javascript/slide_gallery/js/jquery-ui-1.10.3.custom.min.js" type="text/javascript"></script>
<script src="../javascript/slide_gallery/js/jquery.mousewheel.min.js" type="text/javascript"></script>
<script src="../javascript/slide_gallery/js/jquery.kinetic.min.js" type="text/javascript"></script>
<script src="../javascript/slide_gallery/js/jquery.smoothdivscroll-1.3-min.js" type="text/javascript"></script>
<script type="text/javascript">
    $(document).ready(function() {
	$("div#makeMeScrollable").smoothDivScroll({
	    autoScrollingMode: "onStart",
	    touchScrolling: true
	});
    });
</script>